<template>
	<div>
		<!--style="margin-left:150px" -->
		<el-button type="primary" icon="edit" style="margin-left:100px" @click="judgeFormVisible = true">单个添加选择题</el-button>
		<el-button type="primary" icon="edit"  @click.native="addExcel">批量添加选择题</el-button>
		<el-button type="primary"   @click.native="uploadModel">下载批量录入模板</el-button>
		<el-input v-model="searchMessage" placeholder="请输入题目名称"
				  style="width:400px;margin-left:400px;margin-top:50px"></el-input>
		<el-button type="primary" icon="search" @click="search()">搜索</el-button>
		<!--分页列表-->
		<el-table
				:data="tableData4"
				style="width: 85% ; margin-top:50px; margin-left:100px;" element-loading-text="拼命加载中"
				v-loading="listLoading">
			<el-table-column prop="selectAddtimeStr" label="时间"></el-table-column>
			<el-table-column  label="难度星级">
				<template scope="ll">
					<el-rate
							v-model="ll.row.questionDifficulty"
							disabled
							:colors="['#99A9BF', '#F7BA2A', '#FF9900']">
					</el-rate>
				</template>

			</el-table-column>
			<el-table-column prop="questionName" label="题目名称"></el-table-column>
			<el-table-column prop="scoreTypeName" label="测试类型"></el-table-column>
			<el-table-column fixed="right" label="操作" >
				<template scope="scope">
					<el-button @click.native.prevent="updateRow(scope.row)" type="info" size="small">
						修改
					</el-button>
					<el-button @click.native.prevent="deleteRow(scope.row)" type="danger" size="small">
						移除
					</el-button>
				</template>
			</el-table-column>
		</el-table>


		<!--单个添加选择题-->
		<el-dialog title="判断题录入" v-model="judgeFormVisible" :close-on-click-modal="false">
			<el-form :model="editForm" label-width="100px" :rules="judgeFormRules" ref="editForm">

				<el-form-item prop="enterType" label="录入类型">
					<el-select v-model="editForm.scoreType" placeholder="请选择" @change="enter">
						<el-option
								v-for="item in optionsTypes"
								:key="item.value"
								:label="item.label"
								:value="item.value">
						</el-option>
					</el-select>
				</el-form-item>

				<el-form-item label="题目名称" prop="questionName">
					<el-input v-model="editForm.questionName" auto-complete="off"></el-input>
				</el-form-item>
				<el-form-item prop="selectA" label="判断一">
					<el-input v-model="editForm.selectA" auto-complete="off"></el-input>
				</el-form-item>
				<el-form-item prop="selectB" label="判断二">
					<el-input v-model="editForm.selectB" auto-complete="off"></el-input>
				</el-form-item>
				<el-form-item prop="selectAnswer" label="答案">
					<el-select v-model="editForm.selectAnswer" placeholder="请选择">
						<el-option
								v-for="item in optionsAnswer"
								:key="item.value"
								:label="item.label"
								:value="item.value">
						</el-option>
					</el-select>
				</el-form-item>
				<!--2017/8/10 王娇 题型难度-->
				<el-form-item prop="questionDifficulty" label="题型难度">
					<el-rate
							v-model="editForm.questionDifficulty"
							:colors="['#99A9BF', '#F7BA2A', '#FF9900']">
					</el-rate>
				</el-form-item>
				<el-form-item prop="selectPoint" label="分值">
					<el-input v-model="editForm.selectPoint" type="text" auto-complete="off"></el-input>
				</el-form-item>

				<el-form-item prop="selectValues" label="章节测试类型" v-if="selectValues2">
					<el-cascader
							:options="options"
							v-model="editForm.selectValues"
							@change="handleChange">
					</el-cascader>
				</el-form-item>

				<el-form-item prop="selectValues" label="期末测试类型" v-if="selectValues1">
					<el-select v-model="editForm.courseId" placeholder="请选择">
						<el-option
								v-for="item in optionsCourse"
								:key="item.value"
								:label="item.courseName"
								:value="item.courseId">
						</el-option>
					</el-select>
				</el-form-item>
			</el-form>

			<div slot="footer" class="dialog-footer">
				<el-button @click.native="judgeFormVisible = false">取消</el-button>
				<el-button type="primary" @click.native="editSubmit" :loading="editLoading">保存</el-button>
			</div>
		</el-dialog>
		<!--excel上传-->
		<el-dialog title="批量上传" v-model="addFormVisible" :close-on-click-modal="false">
			<el-form :model="addForm" label-width="100px" ref="addForm" :rules="judgeFormRules">
				<el-form-item prop="enterType2" label="录入类型">
					<el-select v-model="addForm.scoreType" placeholder="请选择" @change="enter">
						<el-option
								v-for="item in optionsTypes"
								:key="item.value"
								:label="item.label"
								:value="item.value">
						</el-option>
					</el-select>
				</el-form-item>
				<el-form-item prop="selectValues" label="章节测试类型" v-if="selectValues2">
					<el-cascader
							:options="options"
							v-model="addForm.selectValues"
							@change="handleChange">
					</el-cascader>
				</el-form-item>

				<el-form-item prop="selectValues" label="期末测试类型" v-if="selectValues1">
					<el-select v-model="addForm.courseId" placeholder="请选择">
						<el-option
								v-for="item in optionsCourse"
								:key="item.value"
								:label="item.courseName"
								:value="item.courseId">
						</el-option>
					</el-select>
				</el-form-item>
				<el-form-item label="上传：">
					<my-upload accept="application/vnd.openxmlformats-officedocument.spreadsheetml.sheet" buttonName="选择文件上传" @selectedFile="selectedFile"></my-upload>
					<el-tag :type="file.type">{{file.fileName}}</el-tag>
					<el-tag type="success">只支持07版本以上的Excel</el-tag>
				</el-form-item>
			</el-form>

			<div slot="footer" class="dialog-footer">
				<el-button @click.native="addFormVisible = false">取消</el-button>
				<el-button type="primary" @click.native="addSubmit" :loading="editLoading">确认提交</el-button>
			</div>
		</el-dialog>

		<!--修改内容-->
		<el-dialog title="修改内容" v-model="judgeFormVisible2" :close-on-click-modal="false">
			<el-form :model="updateeditForm" label-width="100px" :rules="judgeFormRules" ref="editForm">
				<el-form-item label="题目名称" prop="questionName">
					<el-input v-model="updateeditForm.questionName" auto-complete="off"></el-input>
				</el-form-item>
				<el-form-item prop="selectA" label="判断一">
					<el-input v-model="updateeditForm.selectA" auto-complete="off"></el-input>
				</el-form-item>
				<el-form-item prop="selectB" label="判断二">
					<el-input v-model="updateeditForm.selectB" auto-complete="off"></el-input>
				</el-form-item>
				<el-form-item prop="selectAnswer" label="答案">
					<el-select v-model="updateeditForm.selectAnswer" placeholder="请选择">
						<el-option
								v-for="item in optionsAnswer"
								:key="item.value"
								:label="item.label"
								:value="item.value">
						</el-option>
					</el-select>
				</el-form-item>
				<el-form-item prop="questionDifficulty" label="难度系数">
					<el-rate
							v-model="updateeditForm.questionDifficulty"
							:colors="['#99A9BF', '#F7BA2A', '#FF9900']">
					</el-rate>
				</el-form-item>
				<el-form-item prop="selectPoint" label="分值">
					<el-input v-model="updateeditForm.selectPoint" type="text" auto-complete="off"></el-input>
				</el-form-item>
			</el-form>
			<div slot="footer" class="dialog-footer">
				<el-button @click.native="judgeFormVisible2 = false">取消</el-button>
				<el-button type="primary" @click.native="editSubmit2" :loading="editLoading">保存</el-button>
			</div>
		</el-dialog>

		<br/>
		<!--分页组件 -->
		<el-col :span="24" class="toolbar">
			<el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange"
						   :current-page="currentPage" :page-sizes="[15, 20, 25, 30]" :page-size="pageSize"
						   layout="total, sizes, prev, pager, next, jumper" :total="total" style="float:right;">
			</el-pagination>
		</el-col>
	</div>
</template>
<script>

import { CourseSection } from '../../api/api'
import { addCourseSection } from '../../api/api'
import { exam } from '../../api/api'
import { EnterAdd } from '../../api/api'
import { update } from '../../api/api'
import { deleteJudge } from '../../api/api'
import{ Upload,downloadModel }from '../../api/api'
import myUpload from '../teacher/public/myUpload.vue';
export default {
    components:{myUpload},
	 data(){
        return {
            tableData4: [],//分页数据
            total: 100,//列表总条数
            pageSize: 15,//每页条数
            currentPage: 1,//当前页码
            listLoading: false,
            options: [], //章节选择数据
            optionsCourse: [],//课程选择数据
            selectValues1: false,//章节选择题
            selectValues2: false,//期末选择题

            //选择录入类型
            optionsTypes: [{
                value: '1',
                label: '期末测试'
            },
                {
                    value: '2',
                    label: '章节测试'
                },
                {
                    value: '3',
                    label: '专升本测试'
                },
                {
                    value: '4',
                    label: '高升专测试'
                }],

            //答案
            optionsAnswer: [{
                value: 'A',
                label: 'A'
            }, {
                value: 'B',
                label: 'B'
            }],

            //题难度
            searchMessage: '',//模糊查询
            judgeFormVisible2: false,//修改页面
            judgeFormVisible: false,//选择题单独录入页面
            addFormVisible: false,//批量录入
            editLoading: false,
            judgeFormRules: {
                questionName:[{required:true,message:'题目名称必须填写',trigger:'blur'}],
                selectA:[{required:true,message:'不能为空',trigger:'blur'}],
                selectB:[{required:true,message:'不能为空',trigger:'blur'}],
                selectAnswer:[{required:true,message:'不能为空',trigger:'blur'}],
               /* questionDifficulty:[{required:true,message:'不能为空',trigger:'blur'}],*/
                selectPoint:[{required:true,message:'不能为空',trigger:'blur'}]
			},
        //增加界面界面
            editForm: {
                scoreType: '',//试题类型
                //题库名称
                questionName: '',
                //选项一
                selectA: '',
                //选项二
				selectB:'',
                //答案
                selectAnswer: '',
                //难度
                questionDifficulty: '',
                //分数
                selectPoint: '',
                //题库选择
                selectValues: [],
                //章节选择
                sectionId: '',
                //课程选择
                courseId: '',
                //题库类型
                enterType: '',
                //题id在更新时候用
                questionId: '',
                //题类型1为选择题
                questionType: 2
            },

            //excel上传
            file: {
                type: '',//文件类型
                fileName: '',//文件名
                fileData: ''//文件时间
            },
            //新增界面数据
            addForm: {
                scoreType:'',
                selectValues: [],
                courseId:'',
                questionType:2,
                sectionId:0
            },
            updateeditForm: {
                //题库名称
                questionName: '',
                //选项一
                selectA: '',
                //选项二
                selectB: '',
                //答案
                selectAnswer: '',
                //难度系数
                questionDifficulty: '',
                //分数
                selectPoint: '',
                //题库选择
                selectValues: [],
                //章节选择
                sectionId: '',
                //课程选择
                courseId: '',
                //题库类型
                enterType: '',
                //判断题id在更新时候用
                questionId: '',
            },
        }

    },
     methods:{
         //选择录入类型
         enter(){
             //期末测试
             if (this.editForm.scoreType== 1||this.addForm.scoreType==1) {
                 this.selectValues1 = true;
                 this.selectValues2 = false;

             } else if (this.editForm.scoreType == 2 || this.addForm.scoreType==2) {
                 this.selectValues2 = true;
                 this.selectValues1 = false;

             }else{
                 this.selectValues1 = false;
                 this.selectValues2 = false;
             }
         },
         //添加测试后的保存
         editSubmit: function () {
             this.$refs.editForm.validate((valid) => {
                 if (valid) {
                     this.$confirm('确认提交吗？', '提示', {}).then(() => {
                         this.editLoading = true;
                         //NProgress.start();
                         let para = Object.assign({}, this.editForm);
                         //期末测试
                         if (this.editForm.scoreType == 1) {
                             exam(para).then((res) => {
                                 this.editLoading = false;
                                 //NProgress.done();
                                 this.$message({
                                     message: '提交成功',
                                     type: 'success'
                                 });
                                 this.judgeFormVisible=false;
                                 this.$refs['editForm'].resetFields();
                                 this.listAll();
                             });
                         }
                         //章节测试
                         if (this.editForm.scoreType == 2) {

                             addCourseSection(para).then((res) => {
                                 this.editLoading = false;
                                 //NProgress.done();
                                 this.$message({
                                     message: '提交成功',
                                     type: 'success'
                                 });
                                 this.judgeFormVisible=false;
                                 this.$refs['editForm'].resetFields();
                                 this.listAll();
                             });
                         }
                         //增加入学测试
                         if (this.editForm.scoreType == 3 || this.editForm.scoreType == 4) {

                             EnterAdd(para).then((res) => {
                                 this.editLoading = false;
                                 //NProgress.done();
                                 this.$message({
                                     message: '提交成功',
                                     type: 'success'
                                 });
                                 this.judgeFormVisible=false;
                                 this.$refs['editForm'].resetFields();
                                 this.listAll();
                             });
                         }

                     });
                 }

             });
         },
         //添加Excel
         addExcel(){
             this.addFormVisible = true;
             this.file.type = "primary";
             this.file.fileName = "未选择任何文件";
             this.addForm = {

                 scoreType:'',
                 selectValues: [],
                 courseId:this.optionsCourse[0].courseId,
                 questionType:2,
				 sectionId:0

             };
         },

         //导入Excel
         addSubmit: function () {
             this.$refs.addForm.validate((valid) => {
                 if (valid) {
                     if (this.file.fileData != '') {
                         this.$confirm('确认提交吗？', '提示', {}).then(() => {
                             this.editLoading = true;
                             let formData = new FormData();
                             formData.append("excelFile", this.file.fileData);
                             formData.append("scoreType", this.addForm.scoreType);
                             formData.append("courseId", this.addForm.courseId);
                             formData.append("sectionId",this.addForm.sectionId);
                             formData.append("questionType",this.addForm.questionType);

                             Upload(formData).then((res) => {
                                 this.addLoading = false;
                                 let {resCode} = res;
                                 if (resCode != 0) {
                                     this.$message({
                                         message: '保存失败',
                                         type: 'error'
                                     });

                                 } else {
                                     this.$message({
                                         message: '提交成功',
                                         type: 'success'
                                     });
                                     this.$refs['addForm'].resetFields(); //重置 字段
                                     this.editLoading = false;
                                     this.addFormVisible = false;
                                     this.listAll();  //获取页面数据
                                 }

                             });
                         });
                     }

                 }
             });
         },
         /**
          * 选取的文件 参数为文件句柄
          * 获取文件信息
          */
         selectedFile(file){
             this.file.fileName = file.name;
             this.file.type = "success";
             this.file.fileData = file;
             //console.log(file);
         },
         handleChange(as){
             this.editForm.courseId = as[0];
             this.editForm.sectionId = as[1];
         },
		 /*2017/8/5 王娇 分页主键跳转*/
         handleSizeChange(val) {
             this.pageSize = val;
             this.listAll();
         },
         handleCurrentChange(val) {
             this.currentPage = val;
             this.listAll();
         },
         //页面数据内容
         listAll(){
             let para = {
                 pageSize: this.pageSize,
                 pageNum: this.currentPage,
                 searchMessage: this.searchMessage
             };
             this.listLoading = true;
             CourseSection(para).then((res) => {
                 this.options = res.resData.listSection;
                 this.optionsCourse = res.resData.listCourse;
                 this.tableData4 = res.resData.page.list;
                 this.total = res.resData.page.total;
                 this.listLoading = false;
                /* console.log(this.optionsCourse[0].courseId);*/
                /* console.log(this.options);*/
             });
         },
         //模糊查询
         search(){
             this.currentPage = 1;
             this.listAll();
             this.searchMessage = "";
         },
         //修改功能
         updateRow(row){
             // alert(row.selectName);
             this.judgeFormVisible2 = true;
             this.updateeditForm = row;
         },
         editSubmit2: function () {
             this.$refs.editForm.validate((valid) => {
                 if (valid) {
                     this.$confirm('确认提交吗？', '提示', {}).then(() => {
                         this.editLoading = true;
                         let para = Object.assign({}, this.updateeditForm);
                         update(para).then((res) => {
                             this.editLoading = false;
                             this.$message({
                                 message: '提交成功',
                                 type: 'success'
                             });
                             this.judgeFormVisible2 = false;
                             this.listAll();
                         });
                     });
                 }
             });
         },
         deleteRow(row) {
             this.$confirm('确认提交吗？', '提示', {}).then(() => {
                 // alert(row.questionId)
                 let para = {questionId: row.questionId};
                 deleteJudge(para)
                 this.listAll();
             });
         },
		 /*下载模板 王娇 2017/8/14*/
         uploadModel(){
             downloadModel('model2.xlsx');
         },
	},
	mounted(){ 
		this.listAll();
    }
}
</script>
